let reportDataList = []
let uploadFormDataSet = document.getElementById('upload-form-dataSet');
uploadFormDataSet.addEventListener('submit', (e) => {
    e.preventDefault();
    const formData = new FormData(uploadFormDataSet);
    var fileInput = document.getElementById('file-input');
    console.log(fileInput.files);
    for (var i = 0; i < fileInput.files.length; ++i) {
        var file = fileInput.files[i];
        formData.append('targetFiles', file);
    }
    // debugger;
    fetch('/to/api', {
        method: 'POST',
        body: formData
    })
        .then(res => res.json())
        .then(data => {
            //清空缓存页面数据
            reportDataList.splice(0, reportDataList.length)
            console.log(data.data)
            reportDataList = data.data
            debugger
            //渲染请求数据
            renderingFetchData(reportDataList)
        })
        .catch(err => console.error('上传失败: ', err));
    // 清空表单
    uploadFormDataSet.reset();
    fileInput.value = '';
})

function renderingFetchData(data) {
    const reportDataList = document.querySelector("[data-res-list]")
    if(data) {
        reportDataList.innerHTML = ''
        for (let i = 0; i < data.length; ++i) {
            let fileName = data[i].fileName
            let reportData = data[i].reportData
            let score = reportData["score"]
            let descStr = reportData["problem_list"].join("  ")
            reportDataList.innerHTML += 
            `
                <li class="report-card">
                    <span class="card-item">
                        <div id="title-2" class="title-i">文件${i+1}:</div>
                        <div>${fileName}</div>
                    </span>
                    <span class="card-item">
                        <div class="title-i">问题描述:</div>
                        <div class="desc-item">${descStr}</div>
                    </span>
                    <span class="card-item">
                        <div class="title-i">得分:</div>
                        <div>${score}</div>
                    </span>
                </li>
            `
        }
    }
}

function showUserBehaviorData(data) {
    document.getElementById('user-behavior-data').textContent = data;
}

function generateReport(data) {
    var userData = parseUserBehaviorData(data);

    // Example: Displaying parsed user behavior data
    for (var i = 0; i < userData.length; i++) {
        console.log(userData[i].action, "-", userData[i].time, "-", userData[i].detail);
    }
}

function parseUserBehaviorData(data) {
    // Example parsing logic, adapt based on your data structure
    var lines = data.split('\n');
    var parsedData = [];

    for (var i = 0; i < lines.length; i++) {
        var parts = lines[i].split(' – ');

        if (parts.length === 3) {
            parsedData.push({
                action: parts[0].trim(),
                time: parts[1].trim(),
                detail: parts[2].trim()
            });
        }
    }

    return parsedData;
}